<template>
  <page-wrap :show-top="showTop" stay-still back hide-tab txtcolor="#fff" title="修改个人信息" :dark="false"
    :bg-color="uNavColor">
    <view class="container">
      <view class="form-box">
        <u-form ref="uForm" :model="form" label-width="110">
          <u-form-item label="姓名" prop="personName">
            <u-input placeholder="请输入姓名" v-model="form.personName" />
          </u-form-item>
          <u-form-item v-if="form.stuNum" label="学号" prop="stuNum">
            <u-input placeholder="请输入学号" v-model="form.stuNum" disabled />
          </u-form-item>
          <!-- <u-form-item label="手机号" prop="telephone">
            <u-input placeholder="请输入手机号" v-model="form.telephone" />
          </u-form-item> -->
        </u-form>
      </view>
      <view style="margin: 32px 16px">
        <u-button shape="circle" type="primary" @click="onSubmit">提 交</u-button>
      </view>
      <view class="tips">
        注：个人信息影响后续服务和活动参与，请务必确认信息正确且完整
      </view>
    </view>
  </page-wrap>
</template>

<script>
import { infoEdit, getUserInfo } from "@/api/modules/career";
export default {
  data() {
    return {
      uNavColor: this.$uNavColor,
      personId: uni.getStorageSync("person-id").slice(2) || undefined,
      form: {
        personName: "",
        stuNum: "",
        // telephone: "",
      },
      rules: {
        personName: [
          { required: true, message: "请输姓名", trigger: ["change", "blur"] },
        ],
        stuNum: [
          {
            required: false,
            message: "请输入学号",
            trigger: ["change", "blur"],
          },
        ],
        // telephone: [
        //   {
        //     required: false,
        //     message: "请输入手机号",
        //     trigger: ["change", "blur"],
        //   },
        // ],
      },
      inputStyle: {
        height: "40rpx",
      },
      showTop: false,
      gotoCareerPathV2: "",
    };
  },
  onLoad(opt) {
    this.gotoCareerPathV2 = opt.gotoCareerPathV2 || "";
    this.getUserInfoFn();
  },
  onReady() {
    this.$refs.uForm.setRules(this.rules);
  },
  onPageScroll(res) {
    this.showTop = res.scrollTop > 0;
  },
  methods: {
    getUserInfoFn() {
      getUserInfo({ uid: "" }).then((res) => {
        if (res.code == 200) {
          const { personName, stuNum, telephone } = res.data;
          this.form.personName = personName;
          this.form.stuNum = stuNum;
          this.form.telephone = telephone;
        }
      });
    },
    onSubmit() {
      const userInfo = getApp().globalData.userInfo;

      const defaultAvatar = this.$imgBase + "common/avatar_default.png";
      this.$refs.uForm.validate(async (valid) => {
        if (valid) {
          try {
            const params = {
              personName: this.form.personName,
              stuNum: this.form.stuNum,
              // telephone: this.form.telephone,
              photo: userInfo.pic || defaultAvatar,
            };
            const res = await infoEdit(params);
            if (res.code != 200) {
              uni.showToast({
                icon: "none",
                title: res.status_desc,
                duration: 1000,
              });
            } else {
              if (this.gotoCareerPathV2) {
                uni.navigateTo({
                  url: "/pagesSub/userCenter/careerPathV2/index",
                });
              } else {
                uni.navigateBack();
              }
            }
          } catch (err) {
            uni.showToast({ icon: "none", title: err.message, duration: 1000 });
          }
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.container {
  background: #fff;
}
.form-box {
  margin: 32px;
}
.tips {
  margin-top: 32rpx;
  padding: 0 32rpx;
  display: flex;
  flex-direction: column;
  color: #f56565;
  &-line {
    display: flex;
    padding: 10rpx 0;
  }
  .dot {
    padding-right: 16rpx;
  }
}
</style>
